<!-- 饼图 -->
<template>
    <echarts :option="option" class="pieChart"/>
</template>

<script>
import echarts from '@/components/echarts/echarts';
export default {
	name: 'pie-chart',
	data () {
		return {
			option: {
				// title: {
				// 	text: '「 什么能力适合当老板 」',
				// 	left: 'center',
				// 	top: 10,
				// 	textStyle: {
				// 		color: '#52def1'
				// 	}
				// },
				visualMap: {
					show: false,
					min: 80,
					max: 600,
					inRange: {
						colorLightness: [0, 1]
					}
				},
				series: [
					{
						name: '访问来源',
						type: 'pie',
						radius: '70%',
						center: ['50%', '50%'],
						data: [
							{ value: 335, name: '讲政治' },
							{ value: 310, name: '守清廉' },
							{ value: 274, name: '有思路' },
							{ value: 400, name: '善作为' },
							{ value: 356, name: '敢担当' }
						].sort(function (a, b) { return a.value - b.value; }),
						roseType: 'radius',
						label: {
							color: '#0efcf0'
						},
						labelLine: {
							lineStyle: {
								color: '#0efcf0',
								shadowColor: '#0efcf0',
								shadowBlur: 20,
							},
							smooth: 0.2,
							length: 10,
							length2: 20
						},
						itemStyle: {
							color: '#52def1',
							shadowBlur: 9.5,
							shadowColor: '#52def1'
						},

						animationType: 'scale',
						animationEasing: 'elasticOut'
					}
				]
			}
		};
	},

	components: {
		echarts
	},

	computed: {},

	// mounted: {},

	methods: {}
};

</script>
<style lang='less' rel="stylesheet/less" scoped>
.pieChart{
        width:100%;
        // height:3.75rem /* 520/80 */
    }
</style>
